<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../../../css/app.css">
    <link rel="stylesheet" type="text/css" href="../../../css/tabBar.css">
    <link rel="stylesheet" type="text/css" href="../comm/buy_comm.css"/>
    <link rel="stylesheet" type="text/css" href="../comm/xy-pop.css"/>
    <link rel="stylesheet" type="text/css" href="../shop_order/shop_order.css">
    <link rel="stylesheet" type="text/css" href="../buy_refund/css/refund_apply.css"/>
    <link rel="stylesheet" type="text/css" href="./css/group_order_detail.css">
    <link rel="stylesheet" type="text/css" href="./css/order_detail.css"/>
    <title>我的订单</title>
    <style type="text/css">
    	.container.top-container{
    		padding-top: 3rem !important;
    	}
    	.order_yzc{
    		width: 22px;display: inline-block;margin: -2px 0 0 -2px;vertical-align: middle;
    	}
    	.group-detail-goods > ul li div{
    		white-space: nowrap;
    	}
    </style>
</head>

<body>
	<div class="header navigationBar">
      	<div class="wrapper">
          	<span id="btn-back" class="header-btn left-btn backtrack"></span>
          	<span class="title">订单详情</span>
      	</div>
  	</div>
  	<div class="container top-container" v-if="list != ''" v-cloak>
		<!-- 67-待发货  68-待付款  69-待评价 70-待收货 71-交易成功 72-交易关闭（已退款） -->
  		<div :class=" is_group ? 'group-detail-top':'group-detail-top order-detail-top'">
  			<template v-if="list.order_state == 1">
  				<h2>等待买家付款</h2>
  				<p v-html="isPayTime"></p>
	  			<img src="../../../image/shop/buy/buy-68.png"/>
  			</template>
  			<template v-if="list.order_state == 2">
  				<h2 v-if="list.group_buying == 1 && list.group_state == 0">待成团，拼团还没有成功</h2>
  				<h2 v-else="">预计48小时内发货</h2>
	  			<img src="../../../image/shop/buy/buy-67.png"/>
  			</template>
  			<template v-if="list.order_state == 3">
  				<h2>等待买家确认收货</h2>
	  			<img src="../../../image/shop/buy/buy-70.png"/>
  			</template>
  			<template v-if="list.order_state == 4">
  				<h2>交易完成，待评价</h2>
	  			<img src="../../../image/shop/buy/buy-69.png"/>
  			</template>
  			<template v-if="list.order_state == 5">
  				<h2>交易完成</h2>
	  			<img src="../../../image/shop/buy/buy-71.png"/>
  			</template>
  			<template v-if="list.order_state == 6">
  				<h2>交易关闭</h2>
	  			<img src="../../../image/shop/buy/buy-72.png"/>
  			</template>
  			<template v-if="list.order_state == 7">
  				<h2>退款进行中</h2>
  			</template>
  			<template v-if="list.order_state == 8">
  				<h2>已成功退款</h2>
  			</template>
  			<template v-if="list.order_state == 9">
  				<h2>退货、退款进行中</h2>
  			</template>
  			<template v-if="list.order_state == 10">
  				<h2>已成功退货、退款</h2>
  			</template>
  			<template v-if="list.order_state == 11">
  				<h2>商家已拒绝退款</h2>
  			</template>
  			<p v-if="list.refund && list.refund.reply != null && list.order_state != 4 && list.order_state != 5" v-html="'拒绝原因：'+list.refund.content"></p>
  		</div>
  		<div class="group-detail-flow" v-show="list.order_state != 1 && list.expressInfo != ''" @click="viewFlow">
  			<img src="../../../image/shop/buy/buy-24.png"/>
  			<p v-html="list.expressInfo.context"></p>
  			<span v-html="list.expressInfo.time"></span>
  		</div>
  		<div class="group-detail-address">
  			<img src="../../../image/shop/buy/buy-16.png"/>
  			<h2><b v-html="'收货人：'+list.shipping.name"></b><i v-html="list.shipping.phone"></i></h2>
  			<p v-html="'收货地址：'+list.shipping.province + list.shipping.city + list.shipping.district + list.shipping.address"></p>
  		</div>
  		<div class="group-detail-people" v-if="list.group_buying == 1">
  			<h2>
  				<img src="../../../image/shop/buy/buy-25.png"/>
  				<span v-if="list.group_status == 1">拼团成功</span>
  				<span v-else="">等待拼团</span>
  			</h2>
  			<ul>
  				<li v-for="(user,index) in list.group">
  					<img :src="user.avater"/>
  					<span v-if="user.is_leader == 1">团主</span>
  				</li>
  			</ul>
  		</div>
  		<div class="group-detail-goods">
  			<h2>
				<img src="../../../image/shop/buy/buy-17.png"/><span v-html="list.shop_name"></span>
				<img src="../../../image/shop/buy/buy-23.png" />
  			</h2>
  			<section class="order-detail-goods" v-for="item in list.goods" :data-goodsid="item.goods_id"
  				:data-optionid="item.option_id" :data-quantity="item.quantity" @click="goGoodsDetail">
				<img :src="item.goods_image+'?x-oss-process=image/resize,m_lfit,w_960'"/>
				<h2 v-html="item.goods_name"></h2>
				<p><img v-if="list.yzc_status == 1" src="../../../image/shop/yzc_icon.png" class="order_yzc" />
				<span v-html="list.yzc_status == 1 ? item.price : '¥'+item.price"></span></p>
				<p v-html="'型号：'+item.option_name"></p>
				<p v-html="'数量：'+item.quantity"></p>
  			</section>
  			<ul>
  				<li>
  					折扣优惠<div v-html="'-¥'+list.coupon_amount"></div>
  				</li>
          <li v-if="list.yzc_status == 1">
  					运费<div v-html="list.express_amount!='0.00'?'¥'+list.express_amount:'包邮'"></div>
  				</li>
  				<li>
  					实付款
            <div>
              <span v-if="list.yzc_status == 1" v-html="list.express_amount!='0.00' ? '¥'+list.express_amount+' + ' : ''"></span>
              <img v-if="list.yzc_status == 1" src="../../../image/shop/yzc_icon.png" class="order_yzc" /><span v-html="list.yzc_status == 1 ? list.order_amount : '¥'+list.order_amount"></span>
            </div>
  				</li>
  			</ul>
  		</div>
  		<ul class="group-detail-list">
  			<li v-if="list.order_sn != ''">
  				<i style="font-style: normal;" v-html="'订单编号：'+list.order_sn+''"></i>
  				<span @click="copyOrderCode" :data-txt="list.order_sn">复制</span>
  			</li>
  			<li v-if="list.order_state != 1" v-html="'交易编号：'+list.out_order_sn" class="apliy-code-number"></li>
  			<li v-html="'创建时间：'+list.date_add"></li>
  			<li v-if="list.date_send" v-html="'发货时间：'+list.date_send"></li>
  			<li v-if="list.date_received" v-html="'成交时间：'+list.date_received"></li>
  		</ul>
  		<div class="group-detail-btn" v-if="list.order_state == 1" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="cancelOrder">取消订单</a>
			<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(list.shop_user)">联系卖家</a> -->
			<!--<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="openShare" v-if="list.group_buying == 1"
				:data-groupid="list.group_id" :data-name="list.goods[0].goods_name">邀请好友</a>-->
			<!--<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="openShare" v-if="list.group_buying == 1">邀请好友</a>-->
			<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="goPayMent" :data-money="list.order_amount" :data-code="list.pay_key">去付款</a>
		</div>
		<div class="group-detail-btn" v-if="list.order_state == 2" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="goRefundApply" v-if="list.is_member_goods!=1">申请退款</a>
			<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(list.shop_user)">联系卖家</a> -->
			<a href="javascript:void(0);" @click="remindSend"  v-show="list.group_buying == 0 || list.group_state != 0">提醒发货</a>
			<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="openShare" v-if="list.group_buying == 1 && list.group_state != 1"
				:data-groupid="list.group_id" :data-name="list.goods[0].goods_name" :data-img="list.goods[0].goods_image">邀请好友</a>
			<!--<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="openShare" v-if="list.group_buying == 1">邀请好友</a>-->
		</div>
		<div class="group-detail-btn" v-if="list.order_state == 3" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="goRefundApply" v-if="list.is_member_goods!=1">申请退款</a>
			<a href="javascript:void(0);" @click="viewFlow">查看物流</a>
			<a href="javascript:void(0);" @click="delayReceipt">延长收货</a>
			<a href="javascript:void(0);" :class="list.group_buying == 1 ? 'group-btn':'a-style3'" @click="sureReceipt">确认收货</a>
		</div>
		<div class="group-detail-btn" v-if="list.order_state == 4" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="goRefundApply" v-if="list.is_member_goods!=1">申请退款</a>
			<!--<a href="javascript:void(0);" @click="buyAgain" :data-yzc="list.yzc_status" :data-options="list.options != '' ? list.options : ''"
  						v-html="list.group_buying == 1 ? '发起拼团' : '再次购买'"></a>-->
			<!--<a href="javascript:void(0);" @click="buyAgain">再次购买</a>-->
			<a href="javascript:void(0);" @click="viewFlow">查看物流</a>
			<a href="javascript:void(0);" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'" @click="buyComment">去评价</a>
		</div>
		<div class="group-detail-btn" v-if="list.order_state == 5" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
			<a href="javascript:void(0);" @click="goRefundApply" v-if="list.is_member_goods!=1">申请退款</a>
			<!--<a href="javascript:void(0);" @click="buyAgain" :data-yzc="list.yzc_status" :data-options="list.options != '' ? list.options : ''"
  						v-html="list.group_buying == 1 ? '发起拼团' : '再次购买'"></a>-->
			<!--<a href="javascript:void(0);" @click="buyAgain">再次购买</a>-->
		</div>
		<div class="group-detail-btn" v-if="list.order_state == 6" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
		</div>
		<div class="group-detail-btn" v-show="list.order_state == 7" :data-orderid="list.id" :data-group="list.group_buying">
			<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(list.shop_user)">联系卖家</a> -->
			<a href="javascript:void(0);" @click="goRefundDetail" :data-id="list.refund ? list.refund.order_return_id : ''">退款详情</a>
			<a href="javascript:void(0);" @click="orderRepealRefund" :data-id="list.refund ? list.refund.order_return_id : ''" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'">撤销申请</a>
		</div>
		<div class="group-detail-btn" v-show="list.order_state == 8" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
		</div>
		<div class="group-detail-btn" v-show="list.order_state == 9" :data-orderid="list.id" :data-group="list.group_buying">
			<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(list.shop_user)">联系卖家</a> -->
			<a href="javascript:void(0);" @click="goRefundDetail" :data-id="list.refund ? list.refund.order_return_id : ''">退款详情</a>
			<a href="javascript:void(0);" @click="orderRepealRefund" :data-id="list.refund ? list.refund.order_return_id : ''" :class=" list.group_buying == 1 ? 'group-btn':'a-style3'">撤销申请</a>
		</div>
		<div class="group-detail-btn" v-show="list.order_state == 10" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
		</div>
		<div class="group-detail-btn" v-show="list.order_state == 11" :data-orderid="list.id" :data-group="list.group_buying">
			<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
			<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(list.shop_user)">联系卖家</a> -->
			<a href="javascript:void(0);" @click="goRefundDetail" :data-id="list.refund ? list.refund.order_return_id : ''">退款详情</a>
		</div>
		<div class="refund-apply-question" ref="orderQuestion">
  			<div class="" @click="closeCanelOrder"></div>
  			<section>
  				<h2>退款原因</h2>
	  			<ul ref="orderQuestionUl" :class="is_group ? 'groupChecked' : ''">
	  				<li v-for="(item,index) in cancelList" @click="cancelSelect" :data-index="index">
	  					<span v-html="item.content"></span>
	  					<input type="radio" name="question" class="aui-radio" value="" :checked="cancelChecked == index ? 'checked' : ''" :data-content="item.content" :data-id="item.order_reason_id"/>
	  					<textarea rows="0" v-if="index == (cancelList.length - 1)" cols="0" placeholder="请输入其他原因"></textarea>
	  				</li>
	  			</ul>
  			</section>
  			<a href="javascript:void(0);" class="refund-apply-question-btn" :style="is_group ? 'background: #f42020;color: #fff;' : ''" @click="sureCanelOrder">确定</a>
  		</div>
  		<div class="order-share-goods" ref="orderSareGroup">
  			<div class="order-share-bg" @click="closeShare"></div>
	      	<div class="order-share-where">
	        	<div @click="shareToWx" data-type="1">
	          		<img src="../../../image/shop/buy/buy-64.png"/>分享给好友
	        	</div>
		        <div @click="shareToWx" data-type="2">
		          	<img src="../../../image/shop/buy/buy-63.png"/>分享到朋友圈
		        </div>
	      	</div>
	    </div>
  	</div>
</body>
<script src="../../sea.js" data-main="../../main"></script>
<script type="text/javascript" src="../../vue.js"></script>
<script type="text/javascript" src="./js/orderDetail.js"></script>
</html>
